<template>
	<view>
		<view class="headr p32 flex-center">
			<view class="headr_img">
				<image class="img" :src="loginBGImg" mode="aspectFit"></image>
			</view>
			<view class="headr_txt f42 fw-bold">
				<view>Hello</view>
				<view class="">
					欢迎登录
				</view>
			</view>
		</view>

		<!-- 同意阅读 -->
		<!--    <view class="flex-center">
        <radio  color="#05c160" :checked="isShow" @click="radiuos" />
          <text class=" fw400">同意已阅读</text>
          <text class=" fw400 color-cb4b6b" @click="goAbout(1)">《用户协议》</text>
          <text class=" fw400">和</text>
          <text class=" fw400 color-cb4b6b" @click="goAbout(2)">《个人信息保护政策》</text>
    </view> -->

		<!-- 手机号快捷登录 -->
		<view class="p32">
			<button class="WXLogin f32 color-FFFFFF " open-type="getPhoneNumber"
				@getphonenumber="getPhoneNumber">手机号快捷登录</button>
		</view>
	</view>
</template>

<script>
	import {
		WXBindPhone,
		getWxMyUserInfo
	} from '../../utils/http/http.js'
	export default {
		data() {
			return {
				pageTitle: '登录',
				isShow: false,
				loginBGImg: '', //图片
			};
		},
		onLoad() {
			this.loginBGImg = uni.getStorageSync('publicConfig').loginBG.image_url
		},
		methods: {
			radiuos() {
				this.isShow = !this.isShow
			},
			// 获取动态的code获取手机号
			async getPhoneNumber(e) {
				// console.log(e,'ddhdhh');
				if (e.detail.errMsg === 'getPhoneNumber:ok') {
					// 用户同意授权获取手机号
					const {
						encryptedData,
						iv,
						code
					} = e.detail;
					try {
						const modeCode = e.detail.code
						const data = {
							code: modeCode
						}
						const res = await WXBindPhone(data); // 调用后端接口传递参数进行手机号绑定
						if (res.code === 200) {
							// const res = await getWxMyUserInfo()
							uni.navigateBack()
						} else {
							this.$utils.showToast(res.message)
						}

					} catch (err) {
						console.log(err);
					}

				} else {
					this.$utils.showToast('您拒绝了获取手机号')
				}
			},

		}
	}
</script>

<style lang="scss">
	page {
		background-color: #fff;
	}

	.headr_img {
		flex: 1;
		height: 480rpx;
	}

	.headr_img image {
		width: 100%;
		height: 100%;
	}

	.headr_txt {
		flex: 2;
	}

	.color-cb4b6b {
		color: #cb4b6b;
	}

	.WXLogin {
		background-color: #05c160;
		border-radius: 40rpx;
	}
</style>